<template>
  <div id="table_jsgl">
    <el-table :data="this.parent.data" border width="100%" :header-cell-style="{background:'#f9f9f9'}">
      <el-table-column prop="id" label="ID">
      </el-table-column>
      <el-table-column prop="name" label="名称">
      </el-table-column>
      <el-table-column prop="roleRemark" label="备注">
      </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button size="small" plain @click="update(scope.row)">编辑</el-button>
          <el-button size="small" plain autofocus @click="dele(scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>

    <!-- 编辑 -->
    <update-jsgl ref="updatejsgl" :parent="this"></update-jsgl>

  </div>
</template>

<script>
  import update_jsgl from "../update/update_jsgl.vue"
  export default {
    components:{
      'update-jsgl':update_jsgl,
    },
    props: ["parent"],
    methods: {
      // 编辑数据
      update(row){
        this.$refs.updatejsgl.idx = 0;  //编辑
        this.$refs.updatejsgl.row = row;  //传递数据
        this.$refs.updatejsgl.dialogFormVisible = true;  //弹出窗口
        this.$refs.updatejsgl.getTitle();  //获取title
      },

      // 删除数据
      dele(row) {
        // 弹窗
        this.$confirm("你确定删除这条信息吗？,删除后不可恢复", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {   //点击确定
          // 请求数据
          this.$axios.request({
            url: this.API + "/administrator/roleManagement/remove",
            params: {
              ids: row.id
            },
            method:"post",
            // 请求成功
          }).then((res) => {
            // console.log(res)
            if (res.data.code == 0) {  // 删除成功
              this.parent.getData();   //重新请求数据
              this.$message.success("删除成功");
            }else{
              this.$message.error(res.data.msg)
            }
          })
        }).catch(() => {   //点击取消
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
      }
    }
  }
</script>

<style>
  #admin_jsgl .el-table {
    margin-top: 10px;
    height: 100%;
  }

  #admin_jsgl .el-button.is-active {
    border: none;
  }
</style>
